<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:m="http://www.richfaces.org/veles"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>GMap with form</title>
        <style type="text/css" >
            .map_canvas {
                width: 600px;
                height: 400px
            }
        </style>
    </h:head>
    <h:body>
        <div>
            <h:form >
                <h:panelGrid columns="2">
                    <h:column>Latitude:</h:column>
                    <h:column>
                        <h:inputText value="#{place.latitude}" id="latitude" />
                    </h:column>
                    <h:column>Longitude:</h:column>
                    <h:column>
                        <h:inputText value="#{place.longitude}" />
                    </h:column>                    
                </h:panelGrid>
                <f:ajax render="map_canvas" >
                    <p>
                        <h:commandButton action="gmap-with-form" id="submit" value="Submit"/>
                    </p>
                    <m:googleMap latitude="#{place.latitude}" longitude="#{place.longitude}" draggable="true" mapType="ROADMAP"
                         styleClass="map_canvas" id="map_canvas">
                        <m:marker latitude="#{place.latitude}" longitude="#{place.longitude}" draggable="false" />
                    </m:googleMap>
                </f:ajax>
            </h:form>
        </div>
        <div>
            
        </div>
    </h:body>
</html>

